<html lang="en">
<head>
    <title>Login</title>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
<!--    <link rel="shortcut icon" type="image/x-icon" href="./images/favicon.png"/>-->
    <link rel="shortcut icon" href="./images/favicon.ico"/>
<!--    <link href="https://fonts.googleapis.com/css?family=Montserrat:300,300i,400,400i,500,500i,600,600i,700,700i&display=swap"-->
<!--          rel="stylesheet">-->
<!--    <link href="https://fonts.googleapis.com/css?family=Lato:300,300i,400,400i,700,700i&display=swap" rel="stylesheet">-->
    <link rel="stylesheet" href="./css/bootstrap.min.css">
    <link rel="stylesheet" href="./css/font-awesome.min.css">
    <link rel="stylesheet" href="./css/owl.carousel.min.css">
    <link rel="stylesheet" href="./css/animate.min.css">
    <link rel="stylesheet" href="./css/jquery-ui.css">
    <link rel="stylesheet" href="./css/slick.css">
    <link rel="stylesheet" href="./css/chosen.min.css">
    <link rel="stylesheet" href="./css/pe-icon-7-stroke.css">
    <link rel="stylesheet" href="./css/magnific-popup.min.css">
    <link rel="stylesheet" href="./css/lightbox.min.css">
    <link rel="stylesheet" href="./js/fancybox/source/jquery.fancybox.css">
    <link rel="stylesheet" href="./css/jquery.scrollbar.min.css">
    <link rel="stylesheet" href="./css/mobile-menu.css">
    <link rel="stylesheet" href="./fonts/flaticon/flaticon.css">
    <link rel="stylesheet" href="./css/style.css">
</head>
<body class="inblog-page">
<div class="main-content main-content-login">
    <div class="container">
        <div class="row">
            <div class="content-area col-lg-12 col-md-12 col-sm-12 col-xs-12">
                <div class="site-main">
                    <h3 class="custom_blog_title">
                        气清商城注册
                    </h3>
                    <div class="customer_login">
                        <div class="row">
                            <div class="col-lg-6 col-md-6 col-sm-12">
                                <div class="login-item">
                                    <h5 class="title-login">现在注册</h5>
                                    <form class="register" onsubmit="return checkForm()">
                                        <p class="form-row form-row-wide">
                                            <label class="text">邮箱</label>
                                            <input id="email" title="email" type="email" class="input-text" value=""
                                                   placeholder="登录名@主机名.域名">
                                        </p>
                                        <p class="form-row form-row-wide">
                                            <label class="text">手机号码</label>
                                            <input id="phone" title="phone" type="phone" class="input-text"
                                                   placeholder="11位数组1开头">
                                        </p>
                                        <p class="form-row form-row-wide">
                                            <label class="text">用户名</label>
                                            <input id="name" title="name" type="text" class="input-text">
                                        </p>
                                        <p class="form-row form-row-wide">
                                            <label class="text">密码</label>
                                            <input id="password" title="pass" type="password" class="input-text"
                                                   placeholder=" 长度大于6">
                                        </p>
                                        <p class="form-row form-row-wide">
                                            <label class="text">确认密码</label>
                                            <input id="pass2" title="passagian" type="password" class="input-text"
                                                   placeholder="再次输入密码">
                                        </p>
                                        <p class="form-row">
												<span class="inline">
													<input type="checkbox" id="agree">
													<label for="agree"
                                                           class="label-text">我同意 <span>用户准则 & 商城规则</span></label>
												</span>
                                        </p>
                                        <!--                                        <p class="">-->
                                        <!--                                            <input type="submit" class="button-submit" value="现在注册" onclick="">-->
                                        <!--                                        </p>-->

                                        <div class="input-group-btn">
                                            <button type="submit" class="button-submit">现在注册</button>
                                            <!--                                            type="submit"-->
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<a href="#" class="backtotop">
    <i class="fa fa-angle-double-up"></i>
</a>
<script type="application/javascript" src="./js/jquery-1.12.4.min.js"></script>
<script src="./js/jquery.plugin-countdown.min.js"></script>
<script src="./js/jquery-countdown.min.js"></script>
<script src="./js/bootstrap.min.js"></script>
<script src="./js/owl.carousel.min.js"></script>
<script src="./js/magnific-popup.min.js"></script>
<script src="./js/isotope.min.js"></script>
<script src="./js/jquery.scrollbar.min.js"></script>
<script src="./js/jquery-ui.min.js"></script>
<script src="./js/mobile-menu.js"></script>
<script src="./js/chosen.min.js"></script>
<script src="./js/slick.js"></script>
<script src="./js/jquery.elevateZoom.min.js"></script>
<script src="./js/jquery.actual.min.js"></script>
<script src="./js/fancybox/source/jquery.fancybox.js"></script>
<script src="./js/lightbox.min.js"></script>
<script src="./js/owl.thumbs.min.js"></script>
<script src="./js/jquery.scrollbar.min.js"></script>
<script src="./js/frontend-plugin.js"></script>
<!--<script src="./js/jquery.js"></script>-->
<!--<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>-->
<script type="text/javascript">
    // $ = jQuery
    // $(document).ready(function () {
    //     $(".input-group-btn")
    //         .on("click", ".button-submit", doRegist)
    // });


    //注册事件 ajax填写！！！
    function doRegist() {
        // 对数据进行验证
        var email = $('#email').val();
        var phone = $('#phone').val();
        var name = $('#name').val();
        var password = $('#password').val();
        var pass2 = $('#pass2').val();
        // if (checkEmail(email)) ;
        // if (checkPhone(phone)) ;
        // if (checkName(name)) ;
        // if (checkPass(password, pass2)) ;
        // checkEmail(email);
        // checkPhone(phone);
        // checkName(name);
        // checkPass(password, pass2);
        // var user = {}
        var user = {
            'email': email,
            'phone': phone,
            'username': name,
            'password': pass2
        }


        console.log(user)
        $.ajax({
            url: '/user/doRegister',
            dataType: "json",
            type: "post",
            data: user,
            success: function (result) {
                console.log(result)
                if (result.status == 200){
                    window.alert("注册成功！")
                    window.location.href = "http://www.qk.com/login"
                }else {
                    window.alert("注册失败！")
                }
            }
        })
        return false;

    }

    //表单的全部验证
    function checkForm() {
        var email = $('#email').val();
        var phone = $('#phone').val();
        var name = $('#name').val();
        var password = $('#password').val();
        var pass2 = $('#pass2').val();
        var user = {
            'email': email,
            'phone': phone,
            'username': name,
            'password': pass2
        };
        if (checkEmail(email) && checkPhone(phone) && checkName(name) && checkPass(password, pass2) && checkAgree() && checkAll(user)) {

            return doRegist();

        } else {
            return false;
        }
        // checkEmail(email);
        // checkPhone(phone);
        // checkName(name);
        // checkPass(password, pass2);

    }


    function checkAgree() {

        if ($('#agree').is(":checked")) {
            return true;
        } else {
            alert("请勾选用户准则 & 商城规则!");
            return false;
        }
    }

    //判断name
    function checkName(name) {
        if (name == null || name == "") {
            alert("用户名不能为空!");
            $('#name').focus();
            return false;
        } else {
            return true
        }

    }

    function checkAll(user) {
        var a =false;
        $.ajax({
            url: "http://sso.qk.com/user/check",
            dataType: "json",
            type: "post",
            crossDomain: true,
            data: user,
            async: false, //异步处理
            success: function (result) {
                // if (result)
                // console.log(result)
                if (result.status == 200) {
                    // console.log(typeof(result.data))
                    if ( result.data == null || result.data == "") {
                        a = true;
                        // console.log("ok")
                    } else {
                        a = false;
                        window.alert(result.data);
                    }
                }
            }
        })
        // console.log(a)
        return a;
    }

    //对两个密码进行一样的校验
    function checkPass(password, pass2) {
        if (password == null || password == "") {
            alert("密码不能为空!");
            $('#password').focus();
            return false;
        } else if (password.length < 6) {
            alert("密码长度大于6!");
            $('#password').focus();
            return false;
        } else if (pass2 == null || pass2 == "") {
            alert("请再次输入密码!");
            $('#pass2').focus();
            return false;
        } else if (password != pass2) {
            alert("您两次输入的密码不一致，请重新输入!");
            $('#password').focus();
            $('#pass2').focus();
            return false;
        } else {
            return true;
        }
    }

    //对phone进行check
    function checkPhone(phone) {
        if (phone == null || phone == "") {
            alert("手机号码不能为空!");
            $('#phone').focus();
            return false;
        } else if (!isPhone(phone)) {
            alert("您输入的手机号码有误,请重新核对后再输入!");
            $('#phone').focus();
            return false;
        } else {
            return true;
        }
    }

    //判断phone的正则表达式
    function isPhone(str) {
        var reg = /^1[0-9]{10}$/;
        return reg.test(str);
    }


    //对email进行check
    function checkEmail(email) {
        if (email == null || email == "") {
            alert("邮箱不能为空!");
            $('#email').focus();
            return false;
        } else if (!isEmail(email)) {
            alert("您输入的邮箱有误,请重新核对后再输入!");
            $('#email').focus();
            return false;
        } else {
            return true;
        }

    }

    //判断email的正则表达式
    function isEmail(email) {
        var reg = /^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/;
        return reg.test(email);
    }

</script>
</body>
</html>